// 1. 初始化数据
const goodsList = [
    {
        id: "4001874",
        name: "古法温酒汝瓷酒具套装白酒杯莲花温酒器",
        price: "488.00",
        picture:
            "https://yanxuan-item.nosdn.127.net/44e51622800e4fceb6bee8e616da85fd.png",
        desc: "以汝瓷为载体制作的温酒器套组，酒器精美，酒杯玲珑、淡淡的天青釉色，足以让酒席上，再添几分色彩。",
        spec: {
            specAll: "https://yanxuan-item.nosdn.127.net/a39a91be6ace5584ebd305b8c5f6321f.png",
            specOne: "https://yanxuan-item.nosdn.127.net/8fd001f9737f8e1dcd65cd57692102f4.png",
            specTwo: "https://yanxuan-item.nosdn.127.net/79726aed3786e33334646796c4ee83a4.png"
        },
        goodsTitle: {
            titleFri: "珍藏套组（1壶4杯1托盘）+温酒器",
            titleSec: "莲花温碗（温酒器）",
            titleThr: "酒具套组（1壶4杯1托盘",
        }
    },
    {
        id: "4001172",
        name: "称心如意手摇咖啡磨豆机咖啡豆研磨机",
        price: "289.00",
        picture:
            "https://yanxuan-item.nosdn.127.net/84a59ff9c58a77032564e61f716846d6.jpg",
        desc: "化繁为简，书写本源",
    },
    {
        id: "4001594",
        name: "日式黑陶功夫茶组双侧把茶具礼盒装",
        price: "288.00",
        picture:
            "https://yanxuan-item.nosdn.127.net/3346b7b92f9563c7a7e24c7ead883f18.jpg",
        desc: "加长型滤网，办公喝茶更便捷"
    },
    {
        id: "4001009",
        name: "竹制干泡茶盘正方形沥水茶台品茶盘",
        price: "109.00",
        picture:
            "https://yanxuan-item.nosdn.127.net/2d942d6bc94f1e230763e1a5a3b379e1.png",
        desc: "加长型滤网，办公喝茶更便捷"
    },

    {
        id: "4001649",
        name: "大师监制龙泉青瓷茶叶罐",
        price: "139.00",
        picture:
            "https://yanxuan-item.nosdn.127.net/4356c9fc150753775fe56b465314f1eb.png",
        desc: "加长型滤网，办公喝茶更便捷"
    },
    {
        id: "3997185",
        name: "与众不同的口感汝瓷白酒杯套组1壶4杯",
        price: "108.00",
        picture:
            "https://yanxuan-item.nosdn.127.net/8e21c794dfd3a4e8573273ddae50bce2.jpg",
        desc: "加长型滤网，办公喝茶更便捷"
    },
    {
        id: "3997403",
        name: "手工吹制更厚实白酒杯壶套装6壶6杯",
        price: "99.00",
        picture:
            "https://yanxuan-item.nosdn.127.net/af2371a65f60bce152a61fc22745ff3f.jpg",
        desc: "加长型滤网，办公喝茶更便捷"
    },
    {
        id: "3998274",
        name: "德国百年工艺高端水晶玻璃红酒杯2支装",
        price: "139.00",
        picture:
            "https://yanxuan-item.nosdn.127.net/8896b897b3ec6639bbd1134d66b9715c.jpg",
        desc: "加长型滤网，办公喝茶更便捷"
    },
    {
        id: "1",
        name: "班俏BANQIAO超火ins潮卫衣女士2020秋季新款韩版宽松慵懒风薄款外套带帽上衣",
        picture: "https://www.escook.cn/vuebase/pics/1.png",
        desc: "加长型滤网，办公喝茶更便捷",
        price: "108"
    },
    {
        id: "2",
        name: "嘉叶希连帽卫衣女春秋薄款2020新款宽松bf韩版字母印花中长款外套ins潮",
        picture: "https://www.escook.cn/vuebase/pics/2.png",
        desc: "加长型滤网，办公喝茶更便捷",
        price: "129"
    },
    {
        id: "3",
        name: "思蜜怡2020休闲运动套装女春秋季新款时尚大码宽松长袖卫衣两件套",
        picture: "https://www.escook.cn/vuebase/pics/3.png",
        desc: "加长型滤网，办公喝茶更便捷",
        price: "298"
    },
    {
        id: "4",
        name: "思蜜怡卫衣女加绒加厚2020秋冬装新款韩版宽松上衣连帽中长款外套",
        picture: "https://www.escook.cn/vuebase/pics/4.png",
        desc: "加长型滤网，办公喝茶更便捷",
        price: "199"
    },
    {
        id: "5",
        name: "幂凝早秋季卫衣女春秋装韩版宽松中长款假两件上衣薄款ins盐系外套潮",
        picture: "https://www.escook.cn/vuebase/pics/5.png",
        desc: "加长型滤网，办公喝茶更便捷",
        price: "356"
    },
    {
        id: "6", name: "ME&CITY女装冬季新款针织抽绳休闲连帽卫衣女",
        picture: "https://www.escook.cn/vuebase/pics/6.png",
        desc: "加长型滤网，办公喝茶更便捷",
        price: "642"
    },
    {
        id: "7",
        name: "幂凝假两件女士卫衣秋冬女装2020年新款韩版宽松春秋季薄款ins潮外套",
        picture: "https://www.escook.cn/vuebase/pics/7.png",
        desc: "加长型滤网，办公喝茶更便捷",
        price: "819"
    },
    {
        id: "8",
        name: "依魅人2020休闲运动衣套装女秋季新款秋季韩版宽松卫衣 时尚两件套",
        picture: "https://www.escook.cn/vuebase/pics/8.png",
        desc: "加长型滤网，办公喝茶更便捷",
        price: "478"
    },
    {
        id: "9",
        name: "芷臻(zhizhen)加厚卫衣2020春秋季女长袖韩版宽松短款加绒春秋装连帽开衫外套冬",
        picture: "https://www.escook.cn/vuebase/pics/9.png",
        desc: "加长型滤网，办公喝茶更便捷",
        price: "328"
    },
    {
        id: "10",
        name: "Semir森马卫衣女冬装2019新款可爱甜美大撞色小清新连帽薄绒女士套头衫",
        picture: "https://www.escook.cn/vuebase/pics/10.png",
        desc: "加长型滤网，办公喝茶更便捷",
        price: "253"
    },
    {
        id: "9",
        name: "茶具搭档，养壶利器，仿麂皮绒吸水茶巾",
        picture: "https://yanxuan-item.nosdn.127.net/ed155c971b4d5e360a90f4b1e9fdd3c7.png",
        desc: "吸水利器，养壶必备",
        price: "22"
    },
    {
        id: "10",
        name: "一抽即扔免脏手，加厚抽绳式垃圾袋3卷60只",
        picture: "https://yanxuan-item.nosdn.127.net/e7abcc51ce5027b3417002a2514cd3a0.png",
        desc: "18μm及10μm两种厚度，袋身不怕漏，3秒抽绳不脏手",
        price: "14.9"
    }
]
// 渲染
render(goodsList)
function render(arr) {
    let str = ''
    arr.forEach(item => {
        str += `
    <li>
        <a href="../html/productHome.html" class="goodsItem">
            <img src=${item.picture} alt="">
            <p class="goodsName">${item.name}</p>
            <p class="goodsDesc">${item.desc}</p>
            <p class="price">¥${item.price}</p>
        </a>
    </li>
      `
    })
    document.querySelector('.box ul:nth-child(1)').innerHTML = str
    document.querySelector('.box ul:nth-child(2)').innerHTML = str
    document.querySelector('.box ul:nth-child(3)').innerHTML = str
    const newArr = goodsList[0]
    localStorage.setItem("tea", JSON.stringify(newArr))
}

// 排序
const sort = document.querySelector('.sort')
sort.addEventListener('click', function (e) {
    if (e.target.dataset.color === '1') {
        document.querySelector('.sort>a.active').classList.remove('active')
        e.target.classList.add('active')
        render(goodsList)
    }
})
// 价格排序   上
const arrowUp = document.querySelector('.arrowUp')
const arrowDown = document.querySelector('.arrowDown')
arrowUp.addEventListener('click', function () {
    arrowUp.style.borderBottomColor = "#27ba9b"
    arrowDown.style.borderTopColor = "#bbb"
})
// 价格排序   下
arrowDown.addEventListener('click', function () {
    arrowDown.style.borderTopColor = "#27ba9b"
    arrowUp.style.borderBottomColor = "#bbb"
})
// 显示有货
const boxone = document.querySelector('.check .boxLeft')
const span = document.querySelectorAll('.xtx-checkbox>span')
boxone.addEventListener('click', function () {
    let index = 0
    index++
    if (index) {
        span[0].classList.toggle('filter')
    }
})
// 显示特惠
const boxtwo = document.querySelector('.check .boxRight')
boxtwo.addEventListener('click', function () {
    let index = 0
    index++
    if (index) {
        span[1].classList.toggle('filter')
    }
})

// 点击筛选高亮
const lightArr = document.querySelectorAll('.item .body')
const aActive = document.querySelectorAll('.item .body a')

// function light() {
//     for (let i = 0; i < lightArr.length; i++) {
//         light(lightArr[i])
//     }
// }
// light(lightArr)
for (let i = 0; i < lightArr.length; i++) {
    lightArr[i].addEventListener('click', function (e) {
        // light(lightArr)
        if (e.target.tagName === 'A') {
            console.log(i)
            document.querySelector(`.item:nth-child(${i + 1}) a.active`).classList.remove('active')
            e.target.classList.add('active')
        }
    })
}
 shoppingsss(goodArr)

let username = localStorage.getItem("uname")

const li1 = document.querySelector(".xtx_navs li:nth-child(1)")
const li2 = document.querySelector(".xtx_navs li:nth-child(2)")
if (username) {
    li1.innerHTML = `<a href="javascript:;"><i class="iconfont icon-user">${username}</i></a>`
    li2.innerHTML = '<a href="javascript:;">退出登录</a>'
} else {
    li1.innerHTML = '<a href="../html/login.html">请先登录</a>'
    li2.innerHTML = '<a href="../html/register.html">免费注册</a>'
}
// 退出登录
li2.addEventListener("click", function () {
    // 退出登录
    //  删除localStroage的uuu的数据
    localStorage.removeItem("uname")
    location.reload(true)
})
